<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="descript" content="">
	<meta name="keywords" content="">
	<title>运动会</title>
	<link rel="stylesheet" type="text/css" href="../../css/common/common.css">
	<link rel="stylesheet" type="text/css" href="../../css/common/font-awesome-4.6.3/css/font-awesome.min.css">
	<link rel="stylesheet" type="text/css" href="../../css/model/games.css">
</head>
<body>

<!--初始化 start-->
<div id="initialize">
    <div id="status"><i class="fa fa-spinner fa-spin"></i></div>
</div>
<!--初始化 end-->
<header>
	<div class="img-box">
		<img src="../../image/games.png">
	</div>
</header>

<!-- 内容 初始化 -->
<section class="project-box">
	<div class="head">
		<div class="img-box">
			<img src="../../image/head02.png">
		</div>
		<span>微微</span>
	</div>
	<div class="game-box">
		<ul>
			<li>
				<label>性别</label>
				<select>
					<option>请选择性别</option>
					<option>女</option>
					<option>女</option>
				</select>
				<i class="fa fa-angle-right" aria-hidden="true"></i>
			</li>
			<li>
				<label>个人项目</label>
				<select>
					<option>请选择性别</option>
					<option>女</option>
					<option>男</option>
				</select>
				<i class="fa fa-angle-right" aria-hidden="true"></i>
			</li>
		</ul>
		<div class="grop-game">
			<label>团体赛</label>
			<div class="games-txt">
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<span>铅球</span>
				<i class="fa fa-angle-down" aria-hidden="true"></i>
			</div>
			<div style="clear: both;"></div>
		</div>

		<div class="btn">
			<button type="submit">提交</button>
		</div>
	</div>
</section>
<!-- 内容 结束 -->
<script type="text/javascript" src="../../js/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="../../js/public.js"></script>
<script type="text/javascript">
	var a=0;
	$(function(){
		$(".grop-game .games-txt span").on("click",function(){
			$(this).toggleClass('on');
		});
		$(".grop-game .games-txt>i").on("click",function(){
			console.log(a);
			if( a == 0){
				$(".grop-game .games-txt").css({
				"height":"auto"
			});
			$(this).addClass("fa-angle-up").removeClass("fa-angle-down");
						a = 1;
			
			}else{
				$(".grop-game .games-txt").css({
				"height":"1.8rem"
			});
			$(this).addClass("fa-angle-down").removeClass("fa-angle-up");
			a = 0;
			}
		});
	})
</script>
</body>
</html>